<template>
  <div class="userList padding_20">
    <el-input v-model="param.searchCondition"
              placeholder="请输入姓名"
              class="w-200"
              clearable
              @clear="searchOrder" />
    <el-button type="primary"
               @click="searchOrder">查 询</el-button>
    <el-button type="primary"
               @click="handleAdd">新 增</el-button>
    <Table stripe
           border
           :columns="loginId=='1'?userColAdmin:userCol"
           :data="userLists"
           class="mt-20">
      <template slot-scope="{row,index}"
                slot="action">
        <!--<span @click="assignRole(row)">授权</span>-->
        <span @click="handleEdit(row)">编辑</span>
        <span @click="editPwd(row)">还原密码</span>
      </template>
    </Table>
    <page @getList="_getUserList"
          :pageTotal="pageTotal"
          ref="page"></page>
    <assignRole ref="assignRole"
                @getList="_getUserList"></assignRole>
    <userEdit ref="userEdit"
              @getList="_getUserList"></userEdit>
  </div>
</template>

<script>
  import Page from '@/base/page/page'
  import AssignRole from './assignRole'
  import UserEdit from './userEdit'
  import { mapGetters } from 'vuex'
  import md5 from 'js-md5';
  export default {
    name: "userList",
    data () {
      return {
        loginId: sessionStorage.getItem('loginId'),
        userCol: [
          {
            type: 'index2',
            title: '',
            width: 70,
            render: (h, params) => {
              return h('span', params.index + (this.page.pageIndex) * this.page.pageSize + 1);
            }
          },
          {
            title: '账号',
            key: 'loginName',
          },
          {
            title: '用户名',
            key: 'userName',
          },
          {
            title: '真实姓名',
            key: 'realName'
          },
          {
            title: '姓名首字母',
            key: 'firstNameCharacter'
          },
          {
            title: '性别',
            key: 'sex',
            render: (h, params) => {
              let tmp = ''
              if (params.row.sex == 0) {
                tmp = '女';
              } else {
                tmp = '男';
              }
              return h('span', tmp);
            }
          },
          {
            title: '是否离职',
            key: 'status',
            render: (h, params) => {
              if (params.row.isOnJob == '1') {
                return h('span', '在职');
              } else {
                return h('span', '离职');
              }
            }
          },
          {
            title: '操作',
            slot: 'action',
            align: 'center'
          }
        ],
        userColAdmin: [
          {
            type: 'index2',
            title: '',
            width: 70,
            render: (h, params) => {
              return h('span', params.index + (this.page.pageNum - 1) * this.page.pageSize + 1);
            }
          },
          {
            title: '医院名称',
            key: 'hospitalName',
          },
          {
            title: '登陆账号',
            key: 'loginName'
          },
          {
            title: '昵称',
            key: 'nickName'
          },
          {
            title: '角色',
            key: 'roleName',
            render: (h, params) => {
              if (params.row.roleName == 0) {
                params.row.roleName = '';
              }
              return h('span', params.row.roleName);
            }
          },
          {
            title: '是否启用',
            key: 'status',
            render: (h, params) => {
              if (params.row.status == '0') {
                return h('span', '禁用');
              } else if (params.row.status == '1') {
                return h('span', '启用');
              } else {
                return h('span', '未分配权限');
              }
            }
          },
          {
            title: '操作',
            slot: 'action',
            align: 'center'
          }
        ],
        userLists: [],
        userRoles: [],
        pageTotal: 0,       //总条数
        param: {
          hospitalId: sessionStorage.getItem('hospitalId'),
          searchCondition: ''
        }
      }
    },
    mounted () {
      this._getUserList()
    },
    methods: {
      handleAdd () {
        this.$refs.userEdit.openView()
      },
      handleEdit (row) {
        this.$refs.userEdit.openView(row)
      },
      editPwd (row) {
        this.$Modal.confirm({
          title: '确认',
          content: '<p>您确认设置为初始密码？</p>',
          onOk: () => {
            this.ajax({
              type: this.api.userEdit.type,
              url: this.api.userEdit.url,
              data: {
                id: row.id,
                loginName: row.loginName,
                password: md5('123456')
              },
              success: (data) => {
                this.$Message.success('密码重置成功');
              },
              error: (data) => {
                this.$Message.error(data.message);
              }
            })
          },
          onCancel: () => {
          }
        });
      },
      assignRole (row) {
        this.$refs.assignRole.openAssignRoleView(row)
      },
      searchOrder () {
        this.$refs.page.setPageNum()
        this._getUserList()
      },
      _getUserList () {
        this.ajax({
          type: this.api.userList.type,
          url: this.api.userList.url,
          data: Object.assign({}, this.page, this.param),
          success: (data) => {
            this.userLists = data.object
            this.pageTotal = data.totalNum
          },
          error: (data) => {
            this.$Message.error(data.message);
          }
        })
      }
    },
    computed: {
      ...mapGetters([
        'page'
      ])
    },
    components: {
      Page,
      AssignRole,
      UserEdit
    }
  }
</script>

<style lang="scss" type="text/scss" rel="stylesheet/scss">
  .userList {
    .disabled {
      display: none;
    }
  }
</style>
